page {
  height: 100%;
}

// 页面容器
.cantainer {
  height: 100%;

  // 单行输入框容器
  .title_cantainer {
    display: flex;
    align-items: center;
    margin-bottom: 30rpx;

    // 红点
    .redPoint {
      display: flex;
      justify-content: center;
      align-items: center;
      color: red;
    }

    // 标题输入框
    input {
      width: 100%;
      height:100%;
      font-size: 32rpx;
    }
  }

  // 内容容器
  .content {
    display: flex;
    flex-direction: column;
    height: 40%;
    align-items: center;
    padding: 10rpx 10rpx 10rpx 15rpx;

    // 多行输入框
    textarea {
      width: 99%;
      height: 80%;
      font-size: 30rpx;
      // border: 5rpx solid black;
    }

    // 自定义资源组件容器
    .resource {
      display: flex;
      width: 99%;
      height: 140rpx;
      // border: 5px solid black;

      .left {
        display: flex;
        height: 100%;
        width: 20%;
        height: 100%;
        // background-color: red; //
        padding: 10rpx;

        button {
          height: 100%;
          display: flex;
          justify-content: center;
          align-items: center;
          color: #ccc;
          padding: 0;
          font-size: 60rpx;
        }
      }

      // 资源展示的容器
      .right {
        width: 80%;
        // background-color: #ccc; //
        padding: 10rpx;
        display: flex;
        justify-content: center;
        align-items: center;

        // 单个资源
        .resource_item {
          display: flex;
          height: 120rpx;
          // border: 5rpx solid #ccc;
          background-color: #F8F8FF;
          border-radius: 15rpx;

          // 资源图片
          .item_img {
            width: 20%;
            height: 120rpx;
            display: flex;
            justify-content: center;
            align-items: center;

          }

          // 资源标题
          .item_name {
            padding: 10rpx;
            width: 77%; //给文本边框设置宽度，需要给文本设置边框，否则会挤占其他布局
            height: 120rpx; //容纳文本的边框高度
            // border:4rpx solid black;
            font-size: 28rpx; //文字大小
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2; //规定行数
            -webkit-box-orient: vertical;
          }

          // 删除按钮
          .dele {
            margin: 10rpx;
            width: 3%;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: red;
            color: white;
            font-size: 60rpx;
          }
        }
      }
    }


  }

  // 单选框容器
  .select_cantainer {
    display: flex;
    align-items: center;
    width: 100%;
    height: 120rpx;
    border-bottom: 3rpx solid #eee;
    padding-left: 10rpx;

    // 左边文字
    .tips {
      font-size: 32rpx;
    }

    // 单选框容器
    .radio_cantainer {
      display: flex;
      position: fixed;
      right: 50rpx;

      .radio {
        margin: 0 10rpx;
      }
    }

  }

  // 滚动选择器的容器
  .picker_cantainer {
    display: flex;
    align-items: center;
    width: 100%;
    height: 120rpx;
    border-bottom: 3rpx solid #eee;
    padding-left: 10rpx;

    // 左边文字
    .hint {
      font-size: 32rpx;
    }

    // 红点
    .redPoint {
      display: flex;
      justify-content: center;
      align-items: center;
      color: red;
      height: 100%;
    }
  }

  // 选择器的容器
  .picker_item {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    right: 50rpx;
  }

  // 发布组件
}